<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>MoroccoBy</title>
        <h:outputStylesheet name="css/jsfcrud.css"/>
        <link href="styles/styles.css" type="text/css" rel="stylesheet"></link>
        <link  href="styles/panier.css" rel="stylesheet" type="text/css"></link>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="resources/scripts/cmd.js"></script>

    </h:head>
    <h:body>

        <ui:include src="head.xhtml"></ui:include>

        <div class="main_container">
            <div id="main_content"> 

                <div class="crumb_navigation">
                    Navigation: <span class="current">Home</span>

                </div>        

                <div class="left_content">

                    <div class="title_box">Categories</div>

                    <ul class="left_menu">
                        <h:form>
                            <c:forEach items="#{homeMB.list}" var="item" varStatus="status">
                                <li class="even">
                                    <h:commandLink  action="#{homeMB.getProduits}" value="#{item.libelle}">
                                        <f:param name="idCategorie" value="#{item.id}" />
                                    </h:commandLink>
                                </li>
                            </c:forEach>
                        </h:form>
                    </ul> 

                    <div class="title_box">Special Products</div>  
                    <div class="border_box">
                        <div class="product_title"><a href="details.html">Motorola 156 MX-VL</a></div>
                        <div class="product_img"><a href="details.html"><img src="images/laptop.png" alt="" title="" border="0" /></a></div>
                        <div class="prod_price"><span class="reduce">350$</span> <span class="price">270$</span></div>
                    </div>  


                    <div class="title_box">Newsletter</div>  
                    <div class="border_box">
                        <input type="text" name="newsletter" class="newsletter_input" value="your email"/>
                        <a href="#" class="join">join</a>
                    </div>  

                    <div class="banner_adds">

                        <a href="#"><img src="images/bann2.jpg" alt="" title="" border="0" /></a>
                    </div>    


                </div><!-- end of left content -->


                <div class="center_content">
                    <div class="center_title_bar">Details de votre panier</div>


                    <div id="cmd" class="table_block">
                        <h:form name="pan">
                            <table id="cart_summary" class="std" width="500px">
                                <thead>
                                    <tr>
                                        <th class="cart_product first_item">Article</th>
                                        <th class="cart_description item">Nom du produit</th>
                                        <th class="cart_ref item">Réf.</th>
                                        <th class="cart_unit item">Prix</th>
                                        <th class="cart_quantity item">Quantité</th>
                                        <th class="cart_total item">Total</th>
                                        <th class="cart_delete last_item"></th>
                                    </tr>
                                </thead>
                                <tfoot>
                                    <tr class="cart_total_price">
                                        <td colspan="5" id="cart_voucher" class="cart_voucher">
                                        </td>
                                        <td colspan="2" class="price total_price_container" id="total_price_container">
                                            <p>Total</p>
                                            <span id="total_price">
                                                <h:outputText id="tot" value="#{panierBean.total}"></h:outputText>
                                            </span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="7">

                                            <a class="cart-order" href="commande.xhtml" id="button_order_cart" title="Commander">Commander</a>

                                        </td>

                                    </tr>
                                </tfoot>
                                <tbody>
                                    <h:form id="cart_ordr">
                                        <c:forEach items="#{panierBean.lignePaniers}" var="lignePanier" >

                                            <tr id="product_1_18_0_0" class="cart_item last_item address_0 odd">
                                                <td class="cart_product">
                                                    <a href=""><img src="Images-Produits/${item.images[0].image}" /></a>
                                                </td>
                                                <td class="cart_description">
                                                    <p class="s_title_block"><a href="">${lignePanier.produit.libelle}</a></p>
                                                    <a href="">${lignePanier.produit.description}</a>	</td>
                                                <td class="cart_ref">${lignePanier.produit.reference}</td>
                                                <td class="cart_unit">
                                                    <span class="price" id="product_price_1_18_0">
                                                        <br/>${lignePanier.produit.prix} </span>
                                                </td>
                                                <td class="cart_quantity">

                                                    <h:inputText  size="3" maxlength="3" value="#{lignePanier.quantite}" > 
                                                        <f:ajax  event="keyup" render="text" />
                                                
                                                    </h:inputText> 
                                                </td>
                                                <td class="cart_total">
                                                    <span class="price" id="total_product_price_1_18_0">
                                                        <h:outputText id="text"  value="#{lignePanier.sousTotal}">
                                                        </h:outputText>
                                                    </span>
                                                </td>
                                                <td class="cart_delete">
                                                    <div>
                                                       
                                                        <h:commandButton id="rmvCart" class="addtocart" action="#{panierBean.remove}"  value="Supprimer" >
                                                            <f:param name="idProd" value="#{lignePanier.produit.id}" />
                                                           
                                                        </h:commandButton>
                                                    </div>
                                                </td>
                                            </tr>
                                            </c:forEach>
                                    </h:form>
                                </tbody>
                            </table>
                        </h:form>
                    </div>


                    <div class="center_title_bar">Recommended Products</div>

                    <div class="prod_box">
                        <div class="top_prod_box"></div>
                        <div class="center_prod_box">            
                            <div class="product_title"><a href="details.html">Motorola 156 MX-VL</a></div>
                            <div class="product_img"><a href="details.html"><img src="images/laptop.gif" alt="" title="" border="0"/></a></div>
                            <div class="prod_price"> <span class="price">270$</span></div>                        
                        </div>
                        <div class="bottom_prod_box"></div>             
                        <div class="prod_details_tab">
                            <a href="#" title="Ajouter au panier">
                                <img src="images/cart.gif" alt="" title="" border="0" class="left_bt"/></a>
                            <a href="details.html" class="prod_details">details</a>            
                        </div>                     
                    </div>

                </div><!-- end of center content -->

                <div class="right_content">

                    <div class="title_box">Connexion</div>

                    <div id="login">

                        <h:form rendered="#{sessionScope['UserLogged'] eq null}">
                            <h:inputText id="email" value="#{authentificationBean.email}" ></h:inputText><br/>
                            <h:inputSecret id="password" value="#{authentificationBean.password}" ></h:inputSecret>
                            <p class="remember_me">
                                <label>
                                    <a href="#" >Mot de passe oublié ?</a>
                                </label>
                            </p>
                            <p class="submit"> <h:commandButton type="submit" action="#{authentificationBean.login}" value="Login"></h:commandButton></p>
                        </h:form>

                        <h:form rendered="#{sessionScope['UserLogged'] ne null}">
                            Bienvenue  #{sessionScope['UserLogged'].compte.pseudo}
                            <h:commandLink action="#{authentificationBean.logout}" value="Deconnexion"></h:commandLink>
                        </h:form>

                    </div>


                    <div class="title_box">What’s new</div>  

                    <ul class="left_menu">
                        <li class="odd"><a href="services.html">Sony</a></li>
                        <li class="even"><a href="services.html">Samsung</a></li>
                        <li class="odd"><a href="services.html">Daewoo</a></li>
                        <li class="even"><a href="services.html">LG</a></li>
                        <li class="odd"><a href="services.html">Fujitsu Siemens</a></li>
                        <li class="even"><a href="services.html">Motorola</a></li>
                        <li class="odd"><a href="services.html">Phillips</a></li>
                        <li class="even"><a href="services.html">Beko</a></li>
                    </ul>      

                    <div class="banner_adds">

                        <a href="#"><img src="images/bann1.jpg" alt="" title="" border="0" /></a>
                    </div>        

                </div><!-- end of right content -->   


            </div><!-- end of main content -->

        </div>
        <ui:include src="footer.xhtml"></ui:include>

    </h:body>

</html>

